<template>
    <el-dialog :title="titleMap[mode]" v-model="visible" :width="1100" destroy-on-close @closed="$emit('closed')" align-center :close-on-click-modal="false">
        <el-main>
            <scTable ref="table" row-key="id" :apiObj="apiObj" @selection-change="selectionChange" stripe remoteSort remoteFilter border :params="query" height="550">
                <el-table-column width="1"></el-table-column>
                <el-table-column type="selection" width="50" reserve-selection align="center"></el-table-column>
                <el-table-column type="index" :label="$t('all.sort')" align="center" width="60"></el-table-column>
                <el-table-column :label="$t('finance.businessdate')" prop="business_date" align="center"></el-table-column>
                <el-table-column :label="$t('finance.orderdate')" prop="contract.contract_code" align="center"></el-table-column>
                <el-table-column :label="$t('finance.businesstype')" prop="type" align="center">
                <template #default="scope">
                    {{scope.row.type == 1?$t('finance.saleorder'):scope.row.type == 2?$t('finance.salesreturn'):$t('finance.other')}}
                </template>
                </el-table-column>
                <el-table-column :label="$t('procure.order.stagetype')" prop="money" align="center">
                <template #default="scope">
                    <div v-for="item in stages_all" :key="item.stages_number">
                    {{ scope.row.stages_number == item.stages_number ? item.type : '' }}
                    </div>
                </template>
                </el-table-column>
                <el-table-column :label="$t('finance.dentall')" prop="money" align="center"></el-table-column>
                <el-table-column :label="$t('finance.recoveredall')" prop="pay_money" align="center"></el-table-column>
                <el-table-column :label="$t('finance.receivableall')" prop="only_money" align="center"></el-table-column>
                <el-table-column :label="$t('all.remark')" prop="remark" align="center"></el-table-column>
            </scTable>
        </el-main>
        <template #footer>
            <el-button @click="visible = false">{{$t('all.cancel')}}</el-button>
            <el-button v-if="mode != 'show'" type="primary" :loading="isSaveing" @click="submit">{{$t('all.confirm')}}</el-button>
        </template>
    </el-dialog>
</template>

<script>
export default {
    props: {
        query: {type: Object, default: () => ({})},
    },
    emits: ['success', 'closed'],
    data() {
        return {
            mode: "add",
            titleMap: {
                add: '新增账户',
                edit: this.$t('finance.receive'),
                show: '查看'
            },
            visible: false,
            isSaveing: false,
            apiObj: this.$API.finance.receivable.detail,
            selection: [],
            stages_all: [
                {stages_number: 0, type: this.$t('procure.order.type0'),},
                {stages_number: 1, type: this.$t('procure.order.type1'),},
                {stages_number: 2, type: this.$t('procure.order.type2'),},
                {stages_number: 3, type: this.$t('procure.order.type3'),},
                {stages_number: 4, type: this.$t('procure.order.type4'),},
                {stages_number: 5, type: this.$t('procure.order.type5'),},
                {stages_number: 6, type: this.$t('procure.order.type6'),},
                {stages_number: 7, type: this.$t('procure.order.type7'),},
                {stages_number: 8, type: this.$t('procure.order.type8'),},
                {stages_number: 9, type: this.$t('procure.order.type9'),},
                {stages_number: 10, type: this.$t('procure.order.type10'),},
                {stages_number: 11, type: this.$t('procure.order.type11'),},
                {stages_number: 12, type: this.$t('procure.order.type12'),},
            ],
        }
    },
    mounted() {
    },
    methods: {
        //显示
        open(mode = 'add') {
            this.mode = mode;
            this.visible = true;
            return this
        },
        submit() {
            this.$emit('success', this.selection)
            this.visible = false
        },
        selectionChange(selection) {
            this.selection = selection;
        },
    }
}
</script>

<style></style>
